<div>
  <div>
    <span class="label">userID:</span>
    {{ member.userID }}
    <a *ngIf="showCancelBan" type="text" (click)="cancelMute()">取消禁言</a>
    <a [ngStyle]="{'color': 'red'}" nz-popover [nzPopoverContent]="contentTemplate"
      nzPopoverPlacement="topRight" nzPopoverTrigger="click" [nzPopoverVisible]="muteTimeVisible"
      [nzPopoverTitle]="'禁言(回车确认)'">禁言</a>
    <ng-template #contentTemplate>
      <nz-input-number [ngStyle]="{'width': '100%'}" [(ngModel)]="muteTime" [nzMin]="1" [nzStep]="1"
        nzPlaceholder="回车确认" (keydown.enter)="setGroupMemberMuteTime()">
      </nz-input-number>
    </ng-template>
  </div>
  <div>
    <span class="label">nick:</span>
    {{ member.nick || '暂无' }}
  </div>
  <div>
    <span class="label">nameCard:</span>
    {{ member.nameCard || '暂无' }}
    <i nz-icon nzType="edit" nzTheme="outline" [ngStyle]="{'cursor': 'pointer'}" nz-popover
      [nzPopoverContent]="nameCardTemplate" nzPopoverPlacement="topRight" nzPopoverTrigger="click"
      [nzPopoverVisible]="muteTimeVisible" [nzPopoverTitle]="'修改群名片'"></i>
    <ng-template #nameCardTemplate>
      <input nz-input [(ngModel)]="nameCard" placeholder="回车确认"
        (keydown.enter)="setGroupMemberNameCard()">
    </ng-template>
  </div>
  <div>
    <span class="label">role:</span>
    <span class="content role" [title]="changeRoleTitle">{{ member.role }}</span>
  </div>
  <div *ngIf="showMuteUntil">
    <span class="label">禁言至:</span>
    <span class="content">{{ muteUntil }}</span>
  </div>
  <a type="text" *ngIf="canChangeRole" (click)="changeMemberRole()">
    {{
    member.role === 'Admin' ? '取消管理员' : '设为管理员'
    }}
  </a>
  <a type="text" *ngIf="showKickout" [ngStyle]="{'color': 'red'}"
    (click)="kickoutGroupMember()">踢出群组
  </a>
</div>
